<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>美兰数据文化馆与图书馆</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/css/public.css" media="all">
    <link rel="shortcut icon" href="<%=request.getContextPath()%>/huazhi/images/favicon.ico"/>
</head>
<style>
    .caller-img{
        border-radius: 100%;
        height: 40px;
        width: 40px;
        float: left;
        border: medium none;
    }
    .divhtml{
        line-height: 20px;
        padding: 9px 0px;
        text-align:left;
        position:relative;
        display:block;
        float:left;
        font-weight: 400;
    }
</style>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body">
                    <ul class="layui-timeline" id="lifechain">
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/layui.all.js"></script>
<script src="<%=request.getContextPath()%>/huazhi/lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>

<script>
    function child(id){
        layui.use(['form','table','carousel'], function(){
            var $ = layui.$
                , form = layui.form
                , table = layui.table
                , carousel = layui.carousel;

            $.ajax({
                type: "post",
                url: "<%=request.getContextPath()%>/rest/lifeChain/getNewLifeChainNormal",
                dataType: "json",
                async: false,
                data:"id="+id,
                success: function (data) {
                    var datas=data.data;
                    for(var i=0;i<data.data.length;i++){
                        var str =data.data[i].createTime;
                        var reg =/(\d{4})\-(\d{2})\-(\d{2})/;
                        var date = str.replace(reg,"$1年$2月$3日");

                        var stryy =data.data[i].createTime2;
//                    var reg =/(\d{4})\-(\d{2})\-(\d{2})/;
//                    var date2 = stryy.replace(reg,"$1时$2分$3秒");
                        var id = "imageHtml" + i;
                        var ids = "image" + i;
                        var lifeli='<li class="layui-timeline-item" style="border-bottom: 1px solid #e0e0e0;">' +
                            '<i class="layui-icon layui-timeline-axis"></i>' +
                            '<div class="layui-timeline-content layui-text">' +
                            '<h3 class="layui-timeline-title">'+date+'<span style="font-size: 14px;">'+stryy+'</span></h3>'+
                            '<div style="float: left">' +
                            '<div class="layui-carousel" id="' + id + '"  lay-filter="' + id + '" style="width: 40px; height: 40px;"><div carousel-item=""  id="' + ids + '" >' +
                            '</div></div>' +
                            '</div>' +
                            '<div  style="margin-left: 50px">'+
                            '<p>'+data.data[i].productName+'<em></em>'+data.data[i].operationType+'</p>'+
                            '<p>地点：'+data.data[i].productPlace+'<em></em>使用人员：'+data.data[i].productUsePersonnel+'</p>'+
                            '<p style="color: #1e9fff"><a href="javascript:;"  style="text-decoration: none;" onclick="singleonclick(\''+data.data[i].id+'\',\''+data.data[i].number+'\')">'+data.data[i].number+'</a></p>'+
                            '</div>' +
                            '</div>' +
                            '</li>'
                        $("#lifechain").append(lifeli)
                    }
                    for(var i=0;i<datas.length;i++) {
                        for (var j = 0; j < datas[i].imageList.length; j++) {
                            var images = '<img src="' + datas[i].imageList[j].src + '" class="caller-img"/>';
                            $("#image"+i).append(images)
                        }
                        layer.photos({
                            photos: "#image"+i
                            ,shift: 5 //0-6的选择，指定弹出图片动画类型，默认随机
                        });
                    }
                    for(var i=0;i<datas.length;i++) {
                        carousel.render({
                            elem: '#imageHtml'+i
                            ,width:40
                            ,height: 40
                            , arrow: 'none'
                            , indicator: 'none'
                            , anim: 'fade'
                            , autoplay: 'true'
                            , interval: '5000'
                        });
                    }
                }
            })
        });

        <%--function imageonclick(id){--%>
        <%--    $.ajax({--%>
        <%--        url:'<%=request.getContextPath()%>/rest/rfid/getBigImage',--%>
        <%--        type: "post",--%>
        <%--        dataType: "json",--%>
        <%--        data:"id="+id,--%>
        <%--        success:function(data){--%>
        <%--            layer.photos({--%>
        <%--                photos: data--%>
        <%--                ,anim: 0 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）--%>
        <%--            });--%>
        <%--        },--%>
        <%--    });--%>
        <%--}--%>

    }
    function singleonclick(id,number) {
        $.ajax({
            url: '<%=request.getContextPath()%>/rest/lifeChain/getProceduresByTid',
            type: "post",
            dataType: "json",
            data: "id=" + id,
            success: function (data) {

                var dates=new Date(data.data.productDateOfProduction);
                //获取当前年
                var year=dates.getFullYear();
                //获取当前月
                var month=dates.getMonth()+1;
                //获取当前日
                var date=dates.getDate();
                var now=year+'-'+p(month)+"-"+p(date);
                function p(s) {
                    return s < 10 ? '0' + s: s;
                }
                var createTime=data.data.createTime
//                var reg =/(\d{4})\-(\d{2})\-(\d{2})/;
//                var createTimes = createTime.replace(reg,"$1年$2月$3日");
                var productWarranty=new Date(data.data.productWarranty);
                //获取当前年
                var yearproductWarranty=productWarranty.getFullYear();
                //获取当前月
                var monthproductWarranty=productWarranty.getMonth()+1;
                //获取当前日
                var dateproductWarranty=productWarranty.getDate();
                var productWarrantynow=yearproductWarranty+'-'+p(monthproductWarranty)+"-"+p(dateproductWarranty);


                var sss='<div class="layui-fluid">'+
                    // '    <div class="layui-row layui-col-space15">'+
                    // '        <div class="layui-col-md12">'+
                    '            <div class="layui-card">'+
                    '                  <form class="layui-form" lay-filter="component-form-element" action="">'+
                    '                        <div class="layui-card-body" style="padding:10px;">'+
                    '                             <div >' +
                    '                                   <div>' +
                    '                                        <div class="layui-tab-item layui-show">'+
                    '                                      <div class="layui-card-header" style="text-align: center;border-bottom: 0px solid #f6f6f6;font-size: 16px;">'+number+'</div>'+
                    // '                                            <div class="layui-card-body layui-row layui-col-space10">'+
                    '                                                <div style="float: right;margin-top: 12px;">EPC标签：'+data.data.epcCode+'</div>'+
                    '                                                <div class="layui-col-md12" style="padding: 0px;border: 3px solid #e6e6e6">'+
                    '                                               <table class="layui-table" style="margin: 0px;">'+
                    '                                          <colgroup>' +
                    '                                           <col width="120">' +
                    '                                           <col width="200">' +
                    '                                           <col width="120">' +
                    '                                           <col width="200">' +
                    '                                          </colgroup>'+
                    '                                    <tbody>' +
                    '                                      <tr>' +
                    '                                      <td style="text-align: center">物 资 名 称</td>' +
                    '                                      <td>'+data.data.productName+'</td>' +
                    '                                      <td style="text-align: center">物 资 种 类</td>' +
                    '                                      <td>'+data.data.productCategory+'</td>'+
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">计 量 单 位</td>' +
                    '                                      <td>'+data.data.productUnit+'</td>'+
                    '                                      <td style="text-align: center">物 资 型 号</td>' +
                    '                                      <td>'+data.data.productModel+'</td>'+
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">生 产 厂 商</td>' +
                    '                                      <td>'+data.data.productManufacturer+'</td>'+
                    '                                      <td style="text-align: center">生 产 日 期</td>' +
                    '                                      <td>'+now+'</td>'+
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">报 废 日 期</td>' +
                    '                                      <td>'+productWarrantynow+'</td>'+
                    '                                      <td style="text-align: center">物 资 来 源</td>' +
                    '                                      <td>'+data.data.productOrigin+'</td>'+
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">购 买 单 价</td>' +
                    '                                      <td>'+data.data.productPrice+'</td>'+
                    '                                      <td style="text-align: center">使 用 人 员</td>' +
                    '                                      <td>'+data.data.productUsePersonnel+'</td>'+
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">存 放 地 点</td>' +
                    '                                      <td>'+data.data.productPlace+'</td>'+
                    '                                      <td style="text-align: center">负 责 部 门</td>' +
                    '                                      <td>'+data.data.productResponsibleDep+'</td>' +
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">负 责  人 员</td>' +
                    '                                      <td>'+data.data.productResponsible+'</td>'+
                    '                                      <td style="text-align: center">使 用 部 门</td>' +
                    '                                      <td>'+data.data.productUseDep+'</td>' +
                    '                                      </tr>'+
                    '                                      <tr>'+
                    '                                      <td style="text-align: center">下 限 阈 值</td>' +
                    '                                      <td>'+data.data.productLimitCount+'</td>'+
                    '                                      <td style="text-align: center">具 体 操 作</td>' +
                    '                                      <td>'+data.data.operationType+'</td></tr>'+
                    '                                   </tbody>'+
                    '                                              </table>'+
                    '                                                </div>' +
                    '                                        <div style="float: right">制单时间：'+createTime+'</div>'+
                    '                                        <div style="float: right">制单人员：'+data.data.operator+'  <input type="text"  style="visibility:hidden;width:20px;"></div>'+
                    //                        '<div style="float: left;"><a class="layui-btn layui-btn-primary layui-btn-xs">打印</a></div>'+
                    // '                                          </div>' +
                    '                                     </div>' +
                    '                               </div>' +
                    '                           </div>' +
                    '                     </div>' +
                    '                 </form>' +
                    '            </div>' +
                    // '        </div>' +
                    // '    </div>' +
                    '</div>'

                layer.open({
                    title :number+"详情",
                    type: 1,
                    area: ['90%', '91%'],
                    content: sss,
                    shade:0.6,
                    anim: 4,
                    skin: 'layui-layer-molv',
                    resize:true,
                    success: function(layero, index){  //当你需要在层创建完毕时即执行一些语句，可以通过该回调 想相当于吧值转到子界面
                        $("#id").val(id)
                    }
                });
            },
        });
    }
</script>
</body>
</html>